<template>
	<view class="sys_treatDet">
		<view class="itsms">
			<view class="info">基本信息</view>
			<view class="txt"><text>姓名</text>{{form.caseUname}}</view>
			<view class="txt"><text>年龄</text>{{form.caseUage}}岁</view>
			<view class="txt"><text>电话</text>{{form.casePhone}}</view>
			<view class="info" style="margin-bottom: 20rpx;">治疗详情</view>
			<!-- 使用 rich-text 渲染处理过的富文本内容 -->
			<rich-text class="textarea" :nodes="processRichText(caseText)"></rich-text>
			<!-- <view class="textarea">{{caseText}}</view> -->
		</view>
		
		<button v-if="isShow" open-type="share" class="fx"><image src="@/static/icons/aaaa1.png" mode=""></image>分享</button>
	</view>
</template>

<script>
	import {
		treatDet,caseDet,caseinfo
	} from '@/api/pagesApi/index.js'
	import baseURLShowImgUP from "@/api/base.js";
	export default {
		data() {
			return {
				form:{},
				baseURLImgUPD:'',
				isShow:true,
				caseText:'',
				FXtid:null,
			}
		},
		onLoad(opt) {
			wx.hideShareMenu()
			this.baseURLImgUPD = baseURLShowImgUP.baseURLShowImgUP;
			if(opt.id){
				this.FXtid = opt.tid
				treatDet({treatid:opt.tid}).then(res=>{
					console.log(res)
					this.caseText = res.data.data.treatText
				})
				caseinfo({caseid:opt.id}).then(res=>{
					console.log(res)
					this.form = res.data.data
				})
			}
			if(opt.FXid){
				console.log(22222222222,opt)
				this.isShow = false
				treatDet({treatid:opt.FXtid}).then(res=>{
					console.log(res)
					this.caseText = res.data.data.treatText
				})
				caseinfo({caseid:opt.FXid}).then(res=>{
					console.log(res)
					this.form = res.data.data
				})
			}
		},
		methods: {
			// 处理富文本内容
			processRichText(html) {
			  // 处理图片
			  html = html
			    .replace(/<img/gi, '<img style="max-width:100% !important;height:auto !important;display:block;margin:0 auto;"')
			    .replace(/width=".*?"/gi, '')  // 删除 width 属性
			    .replace(/height=".*?"/gi, ''); // 删除 height 属性
			
			  // 处理视频（修复 poster="undefined"）
			  html = html
			    .replace(/poster="undefined"/gi, '')  // 删除无效 poster
			    .replace(/<video/gi, '<video style="width:100% !important;height:auto !important;"');
			
			  return html;
			}
		},
		onShareAppMessage(res) {
			console.log(res)
			if (res.from === "button") {
				console.log("来自页面内分享按钮");
			}
			return {
				title: '治疗详情', // 分享标题
				path: `packageA/pages/index/case/detail?FXid=${this.form.caseId}&FXtid=${this.FXtid}`, // 分享路径
				imageUrl: this.baseURLImgUPD+this.form.caseImageafter, // 分享图片
				success: () => {
					console.log("分享成功");
				},
				fail: () => {
					console.log("分享失败");
				}
			};
		}
	}
</script>

<style scoped lang="scss">
	.sys_treatDet {
		width: calc(100% - 40rpx);
		min-height: calc(100vh - 60rpx);
		padding: 20rpx 20rpx 40rpx;
		background-color: #f6f6f6;

		.itsms {
			width: calc(100% - 40rpx);
			padding: 0 20rpx;
			min-height: 1200rpx;
			background-color: #fff;
			border-radius: 24rpx;
			font-size: 28rpx;
			color: #333;
			.txt{
				display: flex;
				align-items: center;
				height: 100rpx;
				border-bottom: 1rpx solid #F5F5F5;
				text{
					width: 80rpx;
				}
			}
			
			.info{
				font-size: 32rpx;
				height: 100rpx;
				line-height: 100rpx;
				border-bottom: 1rpx solid #F5F5F5;
			}
			.textarea{
				margin-top: 20rpx;
			}
		}
	}
	.fx {
		position: absolute;
		right: 40rpx;
		bottom: 210rpx;
		color: #48C2B9;
		width: 110rpx;
		height: 110rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		border-radius: 50%;
		border: 1rpx solid #48C2B9;
		font-size: 24rpx;
	
		image {
			width: 36rpx;
			height: 36rpx;
		}
	}
</style>